<template>
    <el-container class="warp">
      <el-header  class="el-header">
      </el-header>
      <el-container class="content">
        <el-aside class="nav-aside">
          <MenuTest></MenuTest>
        </el-aside>
        <el-main class="content-main"></el-main>
      </el-container>
      <el-footer class="el-footer"></el-footer>
      <keep-alive>

      </keep-alive>
    </el-container>
</template>

<script>
  import MenuTest from './MenuTest';
    export default {
        data() {
            return {
                name: "PageLayer"
            }
        },
        components:{
          MenuTest
        }
    }
</script>

<style scoped>
*{
  margin: 0;
  padding: 0;
}
  .warp{
    width: 1080px;
  }
  .el-header{
    background-color: #909399;
    height: 40px;
    border: 1px #DCDFE6 solid;
  }
  .content{
    height: 550px;
  }
  .nav-aside{
    background-color: #F56C6C;
    border: 1px #DCDFE6 solid;
  }
  .content-main{
    background-color: #E6A23C;
    border: 1px #DCDFE6 solid;
  }
  .el-footer{
    height: 40px;
    background-color: #67C23A;
    border: 1px #DCDFE6 solid;
  }
</style>
